<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="description" content="">
	<meta name="keywords" content="">
	<meta name="author" content="">
<title>便民医疗服务</title>
	<!-- Bootstrap CSS -->
	<link href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css" rel="stylesheet">
	<!-- Font Awesome CSS -->
	<link href="${pageContext.request.contextPath}/assets/css/font-awesome.min.css" rel="stylesheet">
	<!-- FlatIcons CSS -->
	<link href="${pageContext.request.contextPath}/assets/css/flaticon.css" rel="stylesheet">
	<!-- Camera Slider CSS -->
	<link href="${pageContext.request.contextPath}/assets/js/plugins/camera/css/camera.css" rel="stylesheet">
	<!-- Magnific Popup CSS -->
	<link href="${pageContext.request.contextPath}/assets/js/plugins/magnific-popup/magnific-popup.css" rel="stylesheet">
    <!-- Animate CSS -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/animate.css">
	<!-- Main CSS -->
	<link href="${pageContext.request.contextPath}/assets/css/style.css" rel="stylesheet">
	<!-- Responsive CSS -->
	<link href="${pageContext.request.contextPath}/assets/css/responsive.css" rel="stylesheet">
	<!-- Favicon File -->
	
	<!-- Google Web Fonts -->
	<link href="https://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic" rel="stylesheet" type="text/css">
	<link href="https://fonts.googleapis.com/css?family=Roboto:400,100,300,100italic,300italic,400italic,500,500italic,700,700italic,900,900italic" rel="stylesheet" type="text/css">
	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!--[if lt IE 9]><script src="assets/js/html5shiv.min.js"></script><script src="assets/js/respond.min.js"></script><![endif]-->
</head>
<body>
<!-- 判断list是否为空，空的话就跳转到控制器 -->
	<c:if test="${doctorlist==null }">
		<jsp:forward page="../doctorList"></jsp:forward>
	</c:if>
     
	
	
	<!-- Start Header Area -->
	<header class="main-header">
		<div class="container container-relative">
			<!-- Start TopBar Area -->
			<div class="top-bar hidden-sm hidden-xs">
				<div class="row">
					<div class="col-sm-9 col-xs-12">
						<span class="top-info"><i class="fa fa-phone"></i></span>+1 888 888 8888
						<span class="top-info"><i class="fa fa-envelope-o"></i></span>info@yoursite.com
						<span class="top-info"><i class="fa fa-map-marker"></i></span>福建省莆田市医院
						<span class="top-info"><i class="fa fa-calendar"></i></span>周一 ~ 周日 9:00 - 20:00
					</div>
					<div class="col-sm-3 col-xs-12">
						<ul class="list-unstyled list-inline">
							<li><a href="#"><i class="fa fa-facebook"></i></a></li>
							<li><a href="#"><i class="fa fa-twitter"></i></a></li>
							<li><a href="#"><i class="fa fa-instagram"></i></a></li>
							<li><a href="#"><i class="fa fa-vimeo"></i></a></li>
						</ul>
					</div>
				</div>
			</div>
			<!-- End TopBar Area -->
			<!-- Start NavBar Area -->
			<nav id="nav" class="navbar navbar-default navbar-static-top affix-top">
				<div class="container">
					<div class="navbar-header">
						<!-- Start Collapse Button -->
						
						<!-- End Collapse Button -->
						<!-- Start Website Logo -->
						<a href="index.jsp" class="navbar-brand">
							<img src="${pageContext.request.contextPath}/assets/images/logo.png" class="logo" alt="Logo"> Medical <span>Service</span>
						</a>
						<!-- End Website Logo -->
					</div>
					<!-- Start Menu Area -->
					<div class="navbar-collapse collapse">
						<ul class="nav navbar-nav navbar-right">
							<li><a href="index.jsp">首页</a></li>
							<li><a href="about.jsp">关于我们</a></li>
							
							
									<li class="active"><a href="doctors.jsp">医生</a></li>
							
							
									<li><a href="departments.jsp">科室部门</a></li>
							
							
							
							
							<li><a href="contact.jsp">联系我们</a></li>
							<li><a href="personalinfo.jsp">我的信息</a></li>
						</ul>
					</div>
					<!-- Start Menu Area -->
				</div>
			</nav>
			<!-- End NavBar Area -->
		</div>
	</header>
	<!-- End Header Area -->
<div class="main-banner three">
	<div class="container">
		<h2><span>医生简介</span></h2>
	</div>
</div>
<!-- End Page Banner Area -->
<!-- Start Breadcrumb Area -->
<div class="breadcrumb">
	<div class="container">
		<ul class="list-unstyled list-inline">
			<li><a href="${pageContext.request.contextPath}/front/index.jsp">首页</a></li>
			<li><a href="${pageContext.request.contextPath}/front/doctors.jsp">医生</a></li>
			<li class="active">医生简介</li>
		</ul>
	</div>
</div>
<!-- End Breadcrumb Area -->
<!-- Start Main Container Area -->
<div class="container main-container">
	<!-- Start Doctor Profile -->
	<div class="row">
		<div class="col-sm-6 col-xs-12">
			<div class="profile-block">
				<div class="panel panel-profile">
					<div class="panel-heading">
						<img style="width: 345px ;height: 205px" src="${pageContext.request.contextPath}/assets/${doctor.doctorImg}" alt="Doctor Profile Image" class="img-responsive img-center-xs">
						<h3 class="panel-title">${doctor.doctorname}</h3>
						<p class="caption">${doctor.outPatientServiceTypeName}</p>
					</div>
					<div class="panel-body">
						<ul class="list-unstyled">
							<li class="row">
								<span class="col-sm-4 col-xs-12"><strong>专科</strong></span>
								<span class="col-sm-8 col-xs-12">${doctor.outPatientServiceTypeName}</span>
							</li>
							<li class="row">
								<span class="col-sm-4 col-xs-12"><strong>工作年龄</strong></span>
								<span class="col-sm-8 col-xs-12">${doctor.jobtime} 年</span>
							</li>
							<li class="row">
								<span class="col-sm-4 col-xs-12"><strong>工作日</strong></span>
								<span class="col-sm-8 col-xs-12">${doctor.dutyDate}</span>
							</li>
						</ul>
					</div>
					<div class="panel-footer text-center-md text-center-sm text-center-xs">
						<div class="row">
							<div class="col-lg-6 col-xs-12">
								<ul class="list-unstyled list-inline sm-links">
									<li><a href="#"><i class="fa fa-facebook"></i></a></li>
									<li><a href="#"><i class="fa fa-envelope-o"></i></a></li>
									<li><a href="#"><i class="fa fa-phone"></i></a></li>
								</ul>
							</div>
							<div class="col-lg-6 col-xs-12 text-right book-app">
								<a href="${pageContext.request.contextPath}/doctor1/${doctor.doctorid}?url=forward:/front/appointment.jsp" class="btn btn-secondary text-uppercase">预约</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-sm-6 col-xs-12">
			<div class="profile-details">
				<h3 class="main-heading2">里克阿姆斯特朗博士</h3>
				<h4>皇家阿尔弗雷德王子医院 - 英国</h4>
				<h5>2006年6月至2020年7月</h5>
				<p>
					It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text.
				</p>
				<h5>2000年6月至2006年7月</h5>
				<p>
					It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
				</p>
				<p><br></p>
				<h4>皇家阿尔弗雷德王子医院 - 英国</h4>
				<h5>2006年6月至2010年7月</h5>
				<p>
					It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text.
				</p>
			</div>
		</div>
	</div>
	<!-- End Doctor Profile -->
	<!-- Start Spacer Block -->
	<div class="spacer-block"></div>
	<!-- End Spacer Block -->
	<!-- Start Best Doctors -->
	<h2 class="main-heading2 nomargin-top">我们最好的医生</h2>
	<ul id="doctors-grid" class="row">
		<!-- 医生遍历输出   -->
		<c:forEach items="${doctorlist}" var="doctor" begin="1" end ="3">
		<li class="col-md-4 col-sm-6 col-xs-6 doctors-grid">
			<div class="bio-box wow fadeInUp" data-wow-duration="1s" data-wow-delay=".5s">
				<div class="profile-img">
					<img style="width: 345px ;height: 205px" src="${pageContext.request.contextPath}/assets/${doctor.doctorImg}" alt="Doctor" class="img-responsive img-center-sm img-center-xs">
					<div class="overlay">
						<ul class="list-unstyled list-inline sm-links">
							<li><a href="#"><i class="fa fa-facebook"></i></a></li>
							<li><a href="#"><i class="fa fa-envelope-o"></i></a></li>
							<li><a href="#"><i class="fa fa-phone"></i></a></li>
						</ul>
					</div>
				</div>
				<div class="inner">
					<h4>${doctor.doctorname}</h4>
					<p class="designation">${doctor.outPatientServiceTypeName}</p>
					<p class="divider"><i class="fa fa-plus-square"></i></p>
					<p>
						Lorem Ipsum is simply dummy text of the printing and typesetting industry. It was popularised in the with the release of Letraset sheets Lorem Ipsum passages.
					</p>
				</div>
				<a href="${pageContext.request.contextPath }/doctor1/${doctor.doctorid}" class="btn btn-secondary text-uppercase">詳情</a>
			</div>
		</li>
		</c:forEach>
		<!-- End Doctor Bio #1 -->
		
	</ul>
	<!-- End Best Doctors -->
</div>
<!-- End Main Container Area -->
	<!-- Start Footer Area -->
	<footer class="main-footer">
		<div class="footer-area">
			<div class="container">
				<div class="row">
					<!-- Start Information Area -->
					<div class="col-md-3 col-sm-4 col-xs-6">
						<h4>相关信息</h4>
						<ul class="list-unstyled address-list">
							<li class="clearfix">
								<i class="fa fa-phone"></i>
								+1 888 888 8888
							</li>
							<li class="clearfix">
								<i class="fa fa-envelope-o"></i>
								info@yoursite.com
							</li>
							<li class="clearfix address">
								<i class="fa fa-map-marker"></i>
								福建省莆田市医院
							</li>
							<li class="clearfix">
								<i class="fa fa-calendar"></i>
								周一 ~ 周日   9:00 - 20:00
							</li>
						</ul>
					</div>
					<!-- End Information Area -->
					
					
					
				</div>
			</div>
		</div>
		<!-- Start Copyright Area -->
		<div class="copyright">
			<div class="container clearfix">
				<p class="pull-left">
					&copy; 2018 <span>MedicalService</span>
				</p>
				<ul class="list-unstyled list-inline pull-right">
					<li><a href="about.jsp">关于我们</a></li>
					<li><a href="contact.jsp">欢迎联系</a></li>
				</ul>
			</div>
		</div>
		<!-- End Copyright Area -->
	</footer>
	<!-- End Footer Area -->
	<!-- Start Back To Top Button -->
	<div id="back-to-top">
		<a href="#"><i class="fa fa-arrow-up"></i></a>
	</div>
	<!-- End Back To Top Button -->
    <!-- JQuery JS -->
    <script src="${pageContext.request.contextPath}/assets/js/jquery.min.js"></script>
    <!-- JQuery Migrate JS -->
    <script src="${pageContext.request.contextPath}/assets/js/jquery-migrate.min.js"></script>
    <!-- Bootstrap JS -->
    <script src="${pageContext.request.contextPath}/assets/js/bootstrap.min.js"></script>
    <!-- Slider JS Files -->
    <script src="${pageContext.request.contextPath}/assets/js/plugins/camera/js/jquery.mobile.customized.min.js"></script>
    <script src="${pageContext.request.contextPath}/assets/js/plugins/camera/js/jquery.easing.js"></script>
    <script src="${pageContext.request.contextPath}/assets/js/plugins/camera/js/camera.min.js"></script>
    <!-- Modernizr JS -->
    <script src="${pageContext.request.contextPath}/assets/js/plugins/shuffle/jquery.shuffle.modernizr.min.js"></script>
    <!-- Popup JS -->
    <script src="${pageContext.request.contextPath}/assets/js/plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
    <!-- Wow JS -->
    <script src="${pageContext.request.contextPath}/assets/js/wow.min.js"></script>
    <!-- Main JS -->
    <script src="${pageContext.request.contextPath}/assets/js/main.js"></script>
</body>
</html>
